<template>
<div >
  <div >
    <!--  图片信息-->
    <div class="title">
      <img :src="list.artistinfo.avatar_big" alt="">
      <h3>{{this.list.artistinfo.name}}</h3>
    </div>
    <ul class="list">
      <li v-for="(item,index) in list.songlist" :key="index">
        <router-link :to="{path:'musicPlay',query:{songid:item.song_id}}">{{item.title}}</router-link></li>
    </ul>
  </div>

</div>
</template>

<script>

// import axios from'axios'
import {getSinger} from "@/api/api";
export default {
name: "singerList",
  data() {
    return {
      list:{songlist:[],artistinfo:""}
    }

  },
  created(){
    getSinger(this.limits=10,this.$route.query.tinguid).then(res=>{
      console.log(res);
      this.list=res
    })
  },
}
</script>

<style scoped lang="less">
  .title{
    height: 40%;
    padding: 10px;
    //display: flex;
    //justify-content: center;
    text-align: center;
    img{
      width: 60%;
      height: 60%;
    }
  }
  .list {
    //height: 40%;
    overflow: scroll;
    li{
      color: #39a9ed;
      font-size: 16px;
      margin: 5px 20px;
      border-bottom: 1px dashed red;
      text-align: center;
    }
  }
</style>